<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>登录</title>
  <link rel="stylesheet" href="/css/common.css">
  <link rel="stylesheet" href="/css/login.css">
</head>
<script src="js/jquery-3.5.1.min.js"></script>

<body>
  <!-- 导航栏 -->
  <div class="nav">
    <p>传书</p>
    
  </div>

  <!-- 作为一个遮罩,对背景高斯模糊 -->
  <div class="cover"></div>

  <!-- 主窗口区 -->
  <div class="login-container">

    <div class="login-dialog">
      <h3>登录</h3>
      <!-- 通过row, 分开一个一个的 -->
      <div class="row">
        <span>用户名:</span>
        <input type="text" id="userName">
      </div>
      <div class="row">
        <span>密码:</span>
        <input type="password" id="password">
      </div>
      <div class="row">
        <button type="submit" id="submit" onclick="login()">登录</button>
      </div>
      <div class="row">
        <button type="submit" id="submit" onclick="register()">注册</button>
      </div>
    </div>
  </div>
  <script>
    function login() {
      let userName = $("#userName").val();
      let password = $("#password").val();
      if (userName == '' || password == '') {
        alert("用户名或密码为空")
      } else {
        $.ajax({
          type: 'post',
          url: '/user/login',
          data: {
            userName: userName,
            password: password
          },
          success: function (result) {
            if (result.userName != null) {
              alert("登录成功");
              location.href = "home.html";
            } else {
              alert("用户名或密码错误")
            }

          }

        });
      }
    }
    function register() {
      location.href = "register.html";
    }

  </script>

</body>

</html>